// JavaScript Document
// -------- phải khai báo jquey trước khi dùng thư viện này-----
// Cách dùng :
// 1 : nhúng file css ~/Content/admin/css/CalendarCss.css vào trang
// 2. Viết mã javascript thiết lập giá trị cho các biến sau
// mPrev_image = đường dẫn hình ảnh nút back
// mNext_image = đường dẫn hình ảnh nút next

// 3. khai báo trong trang web 1 thẻ div ( để chứa nội dung lịch )
//      <div id="calendarDiv" class="calendarDiv"></div>
// 4. Tại vị trí cần dùng, khai báo 2 thẻ dạng
//  <input type="text" id="text1" />
//  <input type="???" _textboxid="text1" />

var _IdTextboxForCalendar; // bổ sung
var mPrev_image;
var mNext_image;

var mSelectedDay;
var mSelectedMonth;
var mSelectedYear;
var mHighlightedDay = 0;
var mCurrentMonth;
var mCurrentYear;
var mOnHideFunction;


function setSelectedDates(dateString)
{
	var currentSelectedDate = new Date(dateString);
	if(isNaN(currentSelectedDate))
		currentSelectedDate = new Date();
		
	mSelectedDay = currentSelectedDate.getDate();
	mSelectedMonth = currentSelectedDate.getMonth();
	mSelectedYear = currentSelectedDate.getFullYear();
	mCurrentMonth = mSelectedMonth;
	mCurrentYear = mSelectedYear;
}

function getStartDayOfMonthNumber(month, year)
{
	var d = new Date();
	d.setFullYear(year, month, 1); ////
	return d.getDay();
}

function getNumberDaysOfMonth(month, year)
{
	var soNgayTrongThang = new Array(31, 28, 31, 30, 31, 30, 31 ,31, 30, 31, 30, 31);
	if(year%4 == 0) //năm nhuận ?
		soNgayTrongThang[1] = 29;
	return soNgayTrongThang[month];
}

function getMonthName(month)
{
	var tenThang = new Array("Jan", "Feb", "Mar", "Apr", "May", 
		"Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec");
	return tenThang[month];
}

function highlightDay(day, month, year)
{
	var idOfCell = day + getStartDayOfMonthNumber(month, year);
	idOfCell = "dayTD" + idOfCell;
	document.getElementById(idOfCell).style.backgroundColor = "lightgrey";
}

function updateSelectedDate(day, month, year)
{
	mSelectedDay = day;
	mSelectedMonth = month;
	mSelectedYear = year;
}

function goPreviousMonth(calendarDivID)
{
	mCurrentMonth--;
	if(mCurrentMonth<0)
	{
		mCurrentMonth = 11;
		mCurrentYear--;
	}
	generalCalendar(mCurrentMonth, mCurrentYear, calendarDivID);
}

function goNextMonth(calendarDivID)
{
	mCurrentMonth++;
	if(mCurrentMonth>11)
	{
		mCurrentMonth = 0;
		mCurrentYear++;
	}
	generalCalendar(mCurrentMonth, mCurrentYear, calendarDivID);
}

function cancelCalendar(calendarDivID)
{
	var the = document.getElementById(calendarDivID);
	the.style.top = "-1000px";
	the.style.left = "-1200px";
}

function hideCalendar(calendarDivID)
{
	cancelCalendar(calendarDivID);
	mOnHideFunction(mSelectedDay, getMonthName(mSelectedMonth), mSelectedYear);
}

function generalCalendar(month, year, calendarDivID)
{
	var headingHTML = '<table class="monthHeadingTable" border="0">';
	headingHTML += '<tr><td class="changeMonthTD">';
	headingHTML += '<img src="' + mPrev_image + '" title="Hiển thị tháng trước" onclick="goPreviousMonth(\'' + calendarDivID + '\')" /></td>';
	headingHTML += '<td class="monthHeadingTD">' + getMonthName(month)+' '+ year + '</td>';
	headingHTML += '<td class="changeMonthTD">';
	headingHTML += '<img src="' + mNext_image + '" title="Hiển thị tháng tiếp theo" onclick="goNextMonth(\'' + calendarDivID + '\')" /></td></tr></table>';
	
	var ngayTrongTuan = new Array("S", "M", "T", "W", "T", "F", "S");
	var tableInnerHTML = '<tr class="dayHeadTR">';
	for(var i=0; i<ngayTrongTuan.length; i++)
		tableInnerHTML += '<td class="dayHeadTD">'+ ngayTrongTuan[i] +'</td>';
	tableInnerHTML += '</tr>';
	var emementIndex = 1;
	var iCellCounter;
	var iStartDayOfMonth = getStartDayOfMonthNumber(month, year);
	var iNumberDaysOfMonth = getNumberDaysOfMonth(month, year);
	var tableRows = 6;
	var giaTri = iNumberDaysOfMonth+iStartDayOfMonth;
	for(weekIndex=1; weekIndex<=tableRows; weekIndex++)
	{
		tableInnerHTML += '<tr>';
		var dayCount;
		for(dayCount=1; dayCount<=7; dayCount++)
		{
			if(emementIndex<=iStartDayOfMonth || emementIndex>giaTri)
				tableInnerHTML += '<td class="emptyTD" id="dayTD'+ emementIndex +'" >&nbsp;</td>';
			else
			{
				tableInnerHTML += '<td class="dayTD" onclick="updateSelectedDate(';
				tableInnerHTML += (emementIndex-iStartDayOfMonth) +','+ month +','+ year+');';
				tableInnerHTML += 'hideCalendar(\''+ calendarDivID +'\')" ';
				tableInnerHTML += 'id="dayTD'+ emementIndex +'" >'+ (emementIndex-iStartDayOfMonth) +'</td>'
			}
			emementIndex++;
		}
		tableInnerHTML += '</tr>';
	}
	
	var chuoi = headingHTML + '<table class="calendarTable" cellspacing="0"><tbody>';
	chuoi += tableInnerHTML + '</tbody></table>'
	chuoi += '<a href="javascript:cancelCalendar(\''+ calendarDivID + '\')" class="cancelHyperlink">Cancel</a>';
	
	var calendarObj = document.getElementById(calendarDivID);
	calendarObj.innerHTML = chuoi;
	
	// tô sáng
	if(mCurrentMonth==mSelectedMonth && mCurrentYear==mSelectedYear)
		highlightDay(mSelectedDay, mSelectedMonth, mSelectedYear);
}

function showCalendar(x, y, calendarDivID, onHideFunction)
{
	var the = document.getElementById(calendarDivID);
	the.style.left = x + "px";
	the.style.top = y + "px";
	
	mOnHideFunction = onHideFunction;
}

// chuyển 2 hàm này về file gốc cho gọn và dễ sử dụng
function onCalendarHidden(day, month, year) {
    document.getElementById(_IdTextboxForCalendar).value = day + " " + month + " " + year;
}

function SelectDateButton_onclick(event) {
    _IdTextboxForCalendar = $(this).attr("_textboxid");
    var dateString = document.getElementById(_IdTextboxForCalendar).value;
    setSelectedDates(dateString);
    generalCalendar(mCurrentMonth, mCurrentYear, "calendarDiv");
    showCalendar(event.clientX, event.clientY, "calendarDiv", onCalendarHidden);
}

$(document).ready(function (e) {
    $("input[_textboxid]").click(SelectDateButton_onclick);
});